#{extends 'main.html' /} 
#{set title:'BLOG' /} 
#{set 'moreStyles'}
    <link rel="stylesheets" type="text/css" media="screen" href="@{'/public/stylesheets/blog.css'}" />
#{/set}

<div class="blog-posts-area">
#{if posts.size()!=0}
	<div class="area-notification">Latest posts</div>
    #{list items:posts, as:'post' }
    
	<div class="blog-post">
		<h2 class="blog-post-title">${post.title}</h2>
		<p class="blog-post-content">${post.content}</p>
        <p class="blog-more-link"><a href="@{Blog.show(post.class)}">more..</a></p>		
	</div>
	#{/list}
#{/if}
#{else}
    <div class="area-notification">No posts available.</div>
#{/else}
</div>
